Web Page Design for Designers

 Virtual Slide Show

 

 

 

 

 

NEXT

 

 

 

 

 

 

 


 

 

 

 

 

 

 

 

 

Instead of having a continuously scrolling web page, sometimes it is preferable to present information in screen-sized chunks, as would be the case in a multimedia or slide show presentation.

By using tables, you can control the way the 'slides' fit the browser window.

Clicking on a Next button will jump to an Anchor directly above the next slide.

The 'slides' are arranged one above the other like a film strip.

By putting only text or small graphics in the first slides, it gives the slides below time to load up unobtrusively.

 

 

 

 

 

 

BACKNEXT

 

 

 

 

 

 

 


10%

< The four corner pieces of the table are set to 10% Width and Height >

10%

 

 

Centering the image in the browser window is
accomplished by using a table like this.

For clarity, the cell backgrounds have been given a colour
to make them visible.

Firstly, the whole table is set to be 95% Width and Height.

This makes it fit comfortably within the browser window
automatically adjusting to its size.

It has 3 Columns and 3 Rows with the main
area floating in the middle but other combinations may
suit your particular layout better.

 

 

 

10%

BACKNEXT

10%

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

BACKNEXT

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

The smooth blue gradient in the last slide was not created in Photoshop but in Macromedia Director which has a very clever 8-bit gradient algorithm that uses the best possible blues from the web palette and dithers between them.

The gradient was copied and pasted into a Photoshop layer and the file indexed to an Exact palette.

Have a look at the source code to find out some other tricks.

 

 

 

 

 

BACKNEXT

 

 

 

 

Back to Top

 

 

menunext